<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>detail</title>
    {% load static %}
    <link href="{% static 'myApp/bootstrap-3.4.1-dist/css/bootstrap.min.css' %}" rel="stylesheet">
    <script src="{% static 'myApp/jquery-3.5.1/jquery-3.5.1.js' %}" ></script>
    <script src="{% static 'myApp/bootstrap-3.4.1-dist/js/bootstrap.min.js' %}"></script>
</head>
<body>
<nav class="navbar navbar-default" role="navigation">
    <div class="container-fluid">
    <div class="navbar-header">
        <a class="navbar-brand" href="#">投票系统</a>
    </div>
    <form class="navbar-form navbar-left" role="search">
        <div class="form-group">
            <input type="text" class="form-control" placeholder="Search" id="search_text">
        </div>
        <input type="button" class="btn btn-default" id="search_b" value="搜索"></input>
    </form>
        <ul class="nav navbar-nav">
            <li class="active"><a href="{% url 'myApp:index' %}">首页</a></li>
            <li><a href="{% url 'myApp:myvote' user.uid %}">我的投票</a></li>
        </ul>

        <div style="float: right">
        <ul class="nav navbar-nav">
            <li><a href="{% url 'myApp:logout' %}">注销</a></li>
        </ul>
        </div>
    </div>

</nav>
<div class="row">
<div class="col-md-3" >
<table class="table table-bordered">
  <thead>
    <tr>
      <th>最新投票</th>
  </thead>
  <tbody>
    <tr>
      <td>{% if latest_question_list %}
    <ul>
    {% for question in latest_question_list %}
        <li><a href="{% url 'myApp:detail' question.id %} " class="list-group-item">{{ question.question_text }}</a></li>
    {% endfor %}
    </ul>
{% else %}
    <p>No polls are available.</p>
{% endif %}</td>
    </tr>
  </tbody>
</table>
</div>

<div class="col-md-7"  id="search">
<ul>
<form action="{% url 'myApp:vote' question.id %}" method="post">
{% csrf_token %}
<fieldset>
    <legend><h1>{{ question.question_text }}</h1></legend>
    {% if error_message %}<p><strong>{{ error_message }}</strong></p>{% endif %}
<ul class="list-group">
    {% for choice in question.choice_set.all %}
        <li class="list-group-item">
        <input type="radio" name="choice" id="choice{{ forloop.counter }}" value="{{ choice.id }}">
        <label for="choice{{ forloop.counter }}">{{ choice.choice_text }}</label><br>
        </li>
    {% endfor %}
    </ul>
</fieldset>
    <input type="submit" value="Vote" class="btn btn-primary btn-lg " >
</form>
</ul>
</div>

</div>
<script>
    $("#search_b").click(function (){

        var key=$("#search_text").val()
        $.get("{% url 'myApp:search' %}?key="+key,
            function (result){$("#search").html(result);})

    })
</script>
</body>
</html>